// components/good-card/good-card.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    hidden:{
      type: Boolean,
      value: true,
      observer(newVal,oldVal){
        if(!newVal){
          this.showGoodsCard()
        }else{
          this.hideGoodsCard();
        }
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    animation:{},
    enterAnimation:{},
    leaveAnimation: {}
  },

  /**
   * 组件的方法列表
   */
  methods: {
    getEnterAnimation(){
      let animation = wx.createAnimation({
        duration: 600,
        timingFunction: 'ease',
        delay: 0,
        transformOrigin: '50% 50% 0'
      })

      animation.opacity(1).translateY(-200).step()

      this.setData({
        enterAnimation: animation.export()
      })

    },
    getLeaveAnimation() {
      let animation = wx.createAnimation({
        duration: 400,
        timingFunction: 'ease',
        delay: 0,
        transformOrigin: '50% 50% 0'
      })

      animation.opacity(0).translateY(200).step()

      this.setData({
        leaveAnimation: animation.export()
      })

    },
    showGoodsCard() {
    
      this.setData({
        hidden: false
      })
  
      setTimeout(() => {
        this.setData({
          animation: this.data.enterAnimation
        })
      }, 100)
       

    },
    hideGoodsCard() {

      this.setData({
        animation:this.data.leaveAnimation
      })

      setTimeout(()=>{
          this.setData({
            hidden:true
          })
      },160);
    },
    stop(){}
  },
  lifetimes: {
    attached () {
      console.log(this)

      this.getEnterAnimation();
      this.getLeaveAnimation();
    }
  }
  
  
})
